<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <link rel="stylesheet" href="css/北大青鸟课程导航.css">

    <style>
        .box{border: 1px solid #cfe2f5;width: 331px;padding: 5px;font-size: 14px;margin: 20px auto}
        .box ul .title{
            width: 331px;
            color: white;
            font-size: 16px;
            text-align: center;
            position: absolute;top: 99px;right:0px ;line-height: 26px;
            background: rgba(0,0,0,0.5);/*设置背景透明镀          方法1*/


           /* background-color: black; !*方法2*!
            opacity: 0.6;
*/

        }
        .box ul{position: relative}
        .time{text-align: center}



    </style>
</head>
<body>
<div class="box">

    <ul>
       <li> <img src="img/树叶.jpg" width="331" height="125"></li>
        <li class="title">飘落潇潇然</li>

        <div class="time">
        <li>地点：巢湖市庙岗</li>
        <li>时间：2018年10月2号</li>
        </div>

    </ul>
</div>





</body>
</html>